import "@/App.scss";
import {
  useRoutes,
  useLocation,
  useNavigate,
  Navigate,
} from "react-router-dom";
import { useEffect, Component } from "react";
import routes from "./route/index.js";

class ToLogin extends Component {
  componentDidMount(): void {
    console.log(this.props, "propsToLogin");

    // console.log(this, "props");
    // navigate("/login");
  }
  render() {
    return <Navigate to="/login" />;
  }
}
class ToHome extends Component {
  componentDidMount(): void {
    console.log(this.props, "propsToHome");
    // navigate("/home");
  }
  render() {
    return <Navigate to="/home" />;
  }
}
//  function ToHome () {
//   useEffect(() => {
//     let navigate = useNavigate();
//     console.log(navigate, "naviagte");

//     navigate("/home");
//   }, []);
//   return (
//     <div>
//       <div>35</div>
//     </div>
//   );
// };
//路由前置导航守卫
function BeforeRouterEnter() {
  const element = useRoutes(routes);
  let location = useLocation();
  let token = sessionStorage.getItem("token");
  console.log(token);
  //跳转到login，有token, 默认跳转到首页
  if (location.pathname == "/login" && token) {
    return <ToHome></ToHome>;
  }
  //跳转不是login页面，没有有token, 默认跳转到登录页
  if (location.pathname !== "/login" && !token) {
    return <ToLogin></ToLogin>;
  }

  return element;
}
export default function App() {
  return (
    <div className="wrap">
      <BeforeRouterEnter></BeforeRouterEnter>
    </div>
  );
}
